<template>
  <view class="container">
    <!-- <text class="title">字典管理</text>
    <view class="upload-section">
      <button @click="uploadFile">上传字典文件</button>
      <text class="status">{{ status }}</text>
    </view> -->
    <view class="query-section">
      <input type="text" v-model="queryKey" placeholder="请输入要查询的key" />
      <button @click="queryDictionary">查询</button>
	    <button @click="resetQuery">重置</button> <!-- 新增的重置按钮 -->
      <text class="result">{{ queryResult }}</text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      status: '', // 上传状态消息
      queryKey: '', // 查询的key
      queryResult: '', // 查询结果
      dictionary: {
		  "10802010111395012":"1-DELL服务器-DELL poweredge R720",
		  "10802010220000001":"2-TMS备份服务器-IBMX3550M5",
		  "10802010220000002":"3-大华捷通服务器-DELL poweredge R210",
		  "1080B010220000001":"4-IBM服务器-IBMX3250",
		  "1080B010220000004":"5-TMS主服务器-IBM X3550M5",
		  "1080B010220000005":"6-TMS备服务器-IBM 3250",
		  "1080B010220000006":"7-服务器-RH2288HV3",
		  "1080B010220000007":"8-宜家项目 戴尔服务器-PowerEdge R340",
		  "1080B010220000008":"9-服务器-浪潮/NF5280M5/2U",
		  "1080B020120000001":"10-路由器-1",
		  "1080B020120000003":"11-路由器-ER3200G2",
		  "1080B020120000004":"12-宜家项目 H3C路由器- MSR2600-10",
		  "1080B020120000005":"13-生产外网接入路由器-AR2240C",
		  "1080B020120000006":"14-生产外网接入路由器-AR2240C",
		  "1080B020120000007":"15-生产内网路由器-ISR4331-AX/K9",
		  "1080B020120000008":"16-生产内网路由器-ISR4331-AX/K9",
		  "1080B020220000003":"17-华为交换机-S1720--52GWR--4P",
		  "1080B020220000004":"18-生产外网交换机-S5720-36C-EI-AC",
		  "1080B020220000005":"19-生产外网交换机-S5720-36C-EI-AC",
		  "1080B020220000006":"20-普通交换机-S5720-28P-LI-AC",
		  "1080B020220000007":"21-普通交换机-S5720-28P-LI-AC",
		  "1080B020220000008":"22-生产内网交换机-C9300-24T-A",
		  "1080B020220000009":"23-生产内网交换机-C9300-24T-A",
		  "1080B020220000010":"24-交换机-华为_S5735-L48T4S-A",
		  "1080202030000001":"25-北京嘉利得UET、LET61卡、MN180型网控器-北京嘉利得UET、LET61卡、MN180型网控器",
		  "1080202030000002":"26-上海捷鑫网络网控器下联卡-上海捷鑫网络网控器下联卡",
		  "1080202030000003":"27-上海捷鑫网络网控器下联卡-上海捷鑫网络网控器下联卡",
		  "1080202060000001":"28-终端远程管理系统TMS接入设备Modem池-DI-32IP型",
		  "1080B021120000001":"29-双路E1设备及下联卡-双路E1设备DI-32E1型及下联卡I-32IP4",
		  "1080B020520000001":"30-深信服上网行为管理器VPN-AC-1000-C400",
		  "1080B030120000001":"31-生产网防火墙-FPR2110-ASA-K9",
		  "1080B030120000002":"32-生产网防火墙-FPR2110-ASA-K9",
		  "1080B040120000001":"33-UPS-C10KS",
		  "1080B040720000001":"34-监控系统-海康威视",
		  "1080B040720000002":"35-华为环控-ECC800-Pro",
		  "1080B040820000001":"36-伊顿STS-伊顿STS  16A",
		  "1080B040820000002":"37-伊顿STS-伊顿STS  16A",
		  "1080B040920000001":"38-网络设备-机柜",
		  "10802050113006745":"39-DELL台式机-7010/19",
		  "1080B050120000001":"40-宏基台式电脑-D430-H61(ECS)-13",
		  "1080B050120000035":"41-宏基VD430-VD430",
		  "1080B050120000042":"42-办公电脑-戴尔3060MT",
		  "1080B050120000066":"43-戴尔台式电脑-戴尔3060MT",
		  "1080B050120000067":"44-戴尔台式电脑-戴尔3060MT",
		  "1080B050120000074":"45-戴尔台式电脑-戴尔3080SFF",
		  "1080B050120000075":"46-戴尔台式电脑-戴尔3080SFF",
		  "1080205020000013":"47-ThinkPad笔记本电脑SL410k型-ThinkPad笔记本电脑SL410k型",
		  "1080B050220000025":"48-宏基笔记本电脑-Trave1Mate P249",
		  "1080B050220000050":"49-戴尔E3490笔记本电脑-E3490",
		  "1080B050220000076":"50-办公电脑-戴尔5420",
		  "1080B050220000077":"51-办公电脑-戴尔5420",
		  "1080B050220000080":"52-戴尔笔记本5430-Latitude5430",
		  "1080B050220000081":"53-戴尔笔记本5430-Latitude5430",
		  "1080B050220000082":"54-戴尔笔记本5430-Latitude5430",
		  "1080B050220000083":"55-戴尔笔记本5430-Latitude5430",
		  "1080B060120000004":"56-兄弟7180DN-7180DN",
		  "1080B060320000008":"57-投影仪-1",
		  "1080C010320000001":"58-视频会议系统-1",
		  "1080C020420000001":"59-创维彩电-55E5",
		  "1080B040620000001":"60-门禁系统-中控",
		  "1080B010220000002":"61-人保财险前置服务器-IBM3650",
		  "1080B010220000003":"62-阳光保险前置服务器-IBM3250"	  
	  } // 存储字典数据的对象
    };
  },
  methods: {
    // 文件上传方法（需要实现文件解析和存储逻辑）
    uploadFile() {
      // 这里省略了文件选择和解析的逻辑
      // 假设文件已经成功解析并存储在dictionary对象中
      this.status = '数据导入成功';
      // 实际上，你应该在这里调用uni.setStorageSync来保存数据
    },
    // 查询字典数据的方法
    queryDictionary() {
      const value = this.dictionary[this.queryKey];
      this.queryResult = value ? `Value: ${value}` : '未找到对应的值';
    },
    resetQuery() {
      // 重置查询键和查询结果
      this.queryKey = '';
      this.queryResult = ''; // 或者设置为其他初始值
    }
    // 注意：在实际应用中，你需要在页面加载时从本地存储中读取字典数据
    // 并将其赋值给this.dictionary对象
  }
};
</script>

<style>
.container {
  padding: 20px;
}
.title {
  font-size: 24px;
  text-align: center;
  margin-bottom: 20px;
}
.upload-section, .query-section {
  margin-bottom: 20px;
}
.upload-section button, .query-section button {
  margin-top: 10px;
}
.status, .result {
  margin-top: 10px;
  color: #999;
}
</style>